<template>
    <div id="bottom">
        <van-tabbar v-model="active" @change="onChange" active-color="#3cbc71" inactive-color="#808080">
            <van-tabbar-item class="iconfont icon-home-select " to="/">首页</van-tabbar-item>
            <van-tabbar-item class="iconfont icon-tuijian" to="/telev" >热点</van-tabbar-item>
            <van-tabbar-item icon="apps-o" to="/classify">分类</van-tabbar-item>
            <van-tabbar-item class="iconfont icon-wodedangxuan"  @click="my">我的</van-tabbar-item>
        </van-tabbar>
    </div>
</template>

<script>
import { Notify } from 'vant';
export default {
    name:"bottom",
    data() {
        return {
            active:"",

        }
    }, 
    methods: {
    onChange(value) {
        // console.log(value);
    //   Notify({ type: 'primary', message: "你切换到了" + value });
    },
    my() {
             var userInfo = localStorage.getItem("userInfo");
           if(userInfo == null) {
               this.$router.push("/enters")      
           } else {
               this.$router.push("/mine")
           }
    }
  },
}
</script>

<style>
    .m-footer {
        text-align: center;
        padding: 0.3rem 0;
        background-color: rgb(247, 247, 247)
    }
    .m-footer img {
        width: 1rem;
        height: .47rem;
    }
    .icon-home-select::before,
    .icon-tuijian::before,
    .icon-wodedangxuan::before {
        margin-bottom: 4px;
        font-size: 22px;
    }
</style>